<template>
    <div class="home">
        <p>情况一：监视ref定义的 基本类型 数据</p>
        <h2>当前求和为：{{sum}}</h2>
        <button @click="changeSum">点我sum+1</button>
    </div>
</template>


<script setup lang="ts" name = "Page17">
/*
    1.ref 定义的数据。
    2.reactive 定义的数据。
    3.函数返回一个值。
    4.一个包含上述内容的数组。
*/
import { ref, watch} from 'vue';
let sum = ref(0);
function changeSum(){
    sum.value += 1
}   
watch(sum,(newValue,oldValue)=>{
    console.log('sum变化了',newValue,oldValue)
})
</script>

<style lang="scss" scoped>

</style>